import 'package:flutter/material.dart';

import './pages/PhonePage.dart' as phone;
import './pages/PcPage.dart' as pc;

import './Routes/routes.dart' as routes;
class MyMaterial extends StatefulWidget {
  MyMaterial({Key key}) : super(key: key);

  @override
  _MyMaterialState createState() => _MyMaterialState();
}

class _MyMaterialState extends State<MyMaterial> {
  int num = 0;
  List _page_lists = [
    phone.MyHomePage(),
    pc.MyHomePage()
  ];

  @override
  Widget build(BuildContext context) {


   return MaterialApp(
     onGenerateRoute: routes.onGenerateRoute, // 将命名路由传参抽出来封装成一个函数，在Routes模块中
     // materialAPP 是作为根组件使用，定义该页面展示的总体布局
      home: Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.white,
          //appbar 是APP的导航
          title: new Text("随机",
              style: new TextStyle(color: Colors.black45)), // 页面上面导航的标题
        ),
        backgroundColor: Colors.white,
        body: this._page_lists[this.num], // 页面内容
        bottomNavigationBar: BottomNavigationBar(
            currentIndex: this.num, // 将items中下标为this.num的组件选中
            onTap: (int n) {
              // 这个onTap是当点击了底部导航按钮是会调用的方法，n是点击底部按钮的下标

              setState(() {
                //设置选中按钮
                this.num = n;
              });
            },
            type: BottomNavigationBarType.fixed, //当底部的导航按钮超过了3个的时候
            // 会出现bug，底部导航会被白色覆盖，可以通过type 进行设置，这样就可以正常显示了
            items: [
              BottomNavigationBarItem(
                  icon: Icon(Icons.image), title: Text("手机壁纸")), // 底部有3个以上按钮
              //时 会有bug，
              BottomNavigationBarItem(
                  icon: Icon(Icons.remove_from_queue), title: Text("电脑壁纸")),
            ]),
      ),
      theme: ThemeData(
        // 主题
          primarySwatch: Colors.blue // 颜色不能是block ，会报错
      ),
    );
//    return MaterialApp(home: this._page_lists[this.num](),);
  }
}